<template>
    <div id="subPage">
        <div class="top">
            <div class="list tab">
                <div class="search-left">
                    <Tabs v-model="tabActiveName">
                        <TabPane :label="`全部（${checkNum>99?'99+':checkNum}）`" name="-1"></TabPane>
                        <TabPane :label="`未开始的（${notStartedNum>99?'99+':notStartedNum}）`" name="0"></TabPane>
                        <TabPane :label="`进行中（${underwayNum>99?'99+':underwayNum}）`" name="1"></TabPane>
                        <TabPane :label="`已完成（${doneNum>99?'99+':doneNum}）`" name="2"></TabPane>
                    </Tabs>
                </div>
            </div>
            <div class="list">
                <div class="item daterange">
                    <span class="name">检查时间：</span>
                    <DatePicker type="daterange" :options="options" :clearable="true" v-model="dateArr" v-if="inputShow" format="yyyy-MM-dd" placement="top" transfer  placeholder="请选择日期" style="width: 300px;" @on-change="getDateArr" ></DatePicker>
                    <DatePicker type="daterange" format="yyyy-MM-dd" placement="top"  placeholder="请选择日期" v-if="inputShow" style="opacity:0;position: absolute;top:-9999px;width:1px;"></DatePicker>
                </div>
                <div class="item">
                    <span class="name">关键字搜索：</span>
                    <Input  placeholder="请输入" v-model="keyword" style="width: 200px;" clearable/>
                    <input type="password" autocomplete="new-password" style="display: none" />
                </div>
                <div class="item">
                    <span class="name">超时状态：</span>
                    <Select v-model="overdue" clearable style="width:200px;" placeholder="请选择" filterable>
                        <Option
                            v-for="(item , index) in overdueList"
                            :value="item.id"
                            :key="index"
                        >{{item.name}}</Option>
                    </Select>
                    <input type="password" autocomplete="new-password" style="display: none" />
                </div>
                <div class="item btnList">
                    <div class="button submit" @click="searchAll" v-preventReClick="1500">搜索</div>
                    <div class="button cancel" @click="clear">重置</div>
                </div>
            </div>
        </div>
        <div class="bottom">
            <div class="tableBox">
                <div class="tableList">
                    <el-table :data="list" style="width: 100%" height="100%"  :stripe="true">
                        <template slot="empty">
                            <div class="no_lsit" style="width:96%;margin:auto;">
                                <img src="./../../assets/images/common/rotary_nodata.png" alt=""
                                        style="width:3.9rem; height: 2.4rem;">
                            </div>
                        </template>
                        <el-table-column prop="title" label="任务名称" align="center"></el-table-column>
                        <el-table-column prop="startTime" label="计划检查时间" align="center">
                            <template slot-scope="scope">
                                {{scope.row.startTime ? scope.row.startTime == scope.row.endTime ? scope.row.startTime : scope.row.startTime + ' ~ ' + scope.row.endTime : "—"}}
                            </template>
                        </el-table-column>
                        <el-table-column prop="partName" label="检查部位" align="center"></el-table-column>
                        <el-table-column prop="content" label="检查说明" align="center"></el-table-column>
                        <el-table-column prop="state" label="状态"  align="center">
                            <template slot-scope="scope">
                                <div class="p">
                                    <span class="overdueTip" v-if="scope.row.overdue == 1">超</span>
                                    <span style="color:#A9B0BB;" v-if="scope.row.state == 0">未开始</span>
                                    <span style="color:#1891FF;" v-if="scope.row.state == 1">进行中</span>
                                    <span style="color:#28D79C;" v-if="scope.row.state == 2">已完成</span>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="checkResult" label="检查结果" align="center">
                            <template slot-scope="scope">
                                {{scope.row.checkResult ? scope.row.checkResult == '隐患问题' ? scope.row.checkResult : '巡检排查' : "—"}}
                            </template>
                        </el-table-column>
                        <el-table-column fixed="right" label="操作"  align="center">
                            <template slot-scope="scope">
                                <el-button v-if="auth.isComplete" @click="isCompleteFn(scope.row)" :disabled='scope.row.state == 2 || scope.row.state == 0 ' type="text" size="small" v-preventReClick="1500" style="color:#00ACFB;">完成任务</el-button>
                                <el-button type="text" size="small"  :disabled='scope.row.state != 2' @click="addRowFn(5,scope.$index, list)"  v-preventReClick="1500" style="color:#00ACFB;">检查详情</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
                <div class="clearfix pageFix"   >
                    <div class="float-right">
                        <Page v-if="count" style="margin: 20px 0;text-align: center;" :current.sync="current" :total="count" :page-size="pageSize" show-elevator show-total @on-change="pageChange"></Page>
                    </div>
                </div>
            </div>
        </div>

        <Modal v-model="modal" title="检查结果" width="900px;" :mask-closable="false" class-name="msgModal" @on-visible-change='visibleChangeFn'>
            <Tabs v-model="detailActiveName">
                    <TabPane label="排查上报" name="1">
                        <div class="modal">
                            <div class="list">
                                <h2>问题信息</h2>
                                <div style="width: 80%;" class="item">
                                    <span class="tip" style="color:red;top:8px">*</span>
                                    <div class="left">
                                        <span >检查地点 ：</span>
                                        <Input v-model="completeAds" disabled style="width: 530px" clearable/>
                                        <el-button @click.native.prevent="getGPS(1)" size="small" type="text" style="color: #00ACFB">请选择检查地址</el-button>
                                    </div>
                                </div>
                                <div style="width: 80%;" class="item">
                                    <div class="left">
                                        <span>检查部位 ：</span>
                                        <Input disabled v-model="completePartName" style="width: 530px" clearable/>
                                    </div>
                                    <div class="right"></div>
                                </div>
                                <div style="width: 80%;" class="item">
                                    <div class="left" style="align-items:flex-start;">
                                        <span class="tip" style="color:red;">*</span>
                                        <span style="white-space: nowrap;">检查说明 ：</span>
                                        <el-input  maxlength="50" show-word-limit placeholder="请输入"  type="textarea" style="width: 530px"  v-model="completeCheckResult"></el-input>
                                    </div>
                                    <div class="right"></div>
                                </div>
                                <div style="width: 80%;" class="item img">
                                    <span>现场图片 ：</span>
                                    <div class="imgBox" style="width:560px;">
                                        <el-upload
                                            :class="['uploadList',{hideAdd:imgCheckFlag}]"
                                            ref='completeUploadImg'
                                            :headers="headers"
                                            :action="$axios.defaults.baseURL+'/ms/api/quality/check/uploadImg'"
                                            list-type="picture-card"
                                            accept="image/png, image/jpg, image/jpeg"
                                            :before-upload="beforeIMgUpload"
                                            :on-success="reportlogImgSuccess"
                                            name="file"
                                            :limit=10
                                            :on-exceed="exceedImg"
                                            :on-remove="handleReportRemove">
                                            <i  class="el-icon-plus"></i>
                                        </el-upload>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </TabPane>
                    <TabPane label="问题上报" name="2">
                        <div class="modal">
                            <div class="list">
                                <h2>问题信息</h2>
                                <div class="item">
                                    <span class="tip" style="color:red;top:8px">*</span>
                                    <div class="left">
                                        <span >检查地点 ：</span>
                                        <Input v-model="submitData.ads" disabled style="width: 640px" clearable/>
                                        <Input v-show="inputShow"  placeholder="请输入关键字" style="opacity:0;position: absolute;top:-9999px;width:1px;" clearable/>
                                        <el-button @click.native.prevent="getGPS" size="small" type="text" style="color: #00ACFB">请选择检查地址</el-button>
                                    </div>
                                </div>
                                <div class="item switch">
                                    <div class="top">
                                        <div class="readio">
                                            <span class="tip" style="color:red;margin-right:6px">*</span>
                                            <span >检查部位 ：</span>
                                            <RadioGroup v-model="switchCheckName" @on-change='switchCheckNameFn'>
                                                <Radio  :disabled='true' label="选择录入"></Radio>
                                                <Radio  :disabled='true' label="手动录入"></Radio>
                                            </RadioGroup>
                                        </div>
                                        <div class="readio" style="margin-left:55px;">
                                            <span class="tip" style="color:red;margin-right:6px">*</span>
                                            <span >问题明细 ：</span>
                                            <RadioGroup v-model="switchClassName" @on-change='switchClassNameFn' filterable>
                                                <Radio label="选择录入"></Radio>
                                                <Radio label="手动录入"></Radio>
                                            </RadioGroup>
                                        </div>
                                    </div>
                                    <div class="bottom">
                                        <div class="left">
                                        <treeselect v-show="switchCheckName=='选择录入'" :disabled='true'  :options="datalist" placeholder="请选择" @select="getReportCheckSelect" style="width:300px;margin-left:70px;margin-top:10px;" v-model="submitData.partId"/>
                                        <Input :maxlength="30" v-show="switchCheckName=='手动录入'" placeholder="请输入"  v-model="submitData.partName" :disabled='true' style="width: 300px;height:36px;margin-left:70px;margin-top:10px;" clearable/>
                                        </div>

                                        <div class="rigth">
                                            <Select
                                            v-show="switchClassName=='选择录入'"
                                            v-model="submitData.issueTree"
                                            style="width:300px;height:36px;margin-top:10px;"
                                            placeholder="请选择"
                                            filterable
                                            @on-change="getIssueClassSelect"
                                        >
                                            <Option
                                                v-for="(item , index) in issuelist"
                                                :value="item.issueId"
                                                :key="index"
                                            >{{item.issueTypeName==""?item.name:item.issueTypeName+'/'+item.name}}</Option>
                                        </Select>
                                        <!-- <treeselect  :options="issuelist" placeholder="请选择" @select="getIssueClassSelect"
                                        style="width:300px;margin-left:70px;margin-top:10px;" v-model="submitData.issueTree"/>  -->
                                        <Input :maxlength="50" v-show="switchClassName=='手动录入'" placeholder="请输入"   v-model="submitData.issueContent" style="width: 300px;height:36px;margin-top:10px;" clearable/>
                                        </div>
                                    </div>
                                </div>
                                <div class="item ">
                                    <div class="readio">
                                        <span class="tip" style="color:red;">*</span>
                                        <span >紧急程度 ：</span>
                                        <RadioGroup v-model="submitData.generalRadio">
                                            <Radio label="一般"></Radio>
                                            <Radio label="紧急"></Radio>
                                        </RadioGroup>
                                    </div>
                                </div>
                                <div class="item">
                                    <span class="tip" style="color:red;">*</span>
                                     <span style="white-space: nowrap;">检查说明 ：</span>
                                    <el-input  maxlength="50" show-word-limit placeholder="请输入"  type="textarea" style="width: 720px"  v-model="submitData.checkText"></el-input>
                                    </div>
                                <div class="item img">
                                    <span style="margin-right:5px;white-space:nowrap;" >现场图片 ：</span>
                                    <div class="imgBox">
                                        <el-upload
                                            :class="{hideAdd:imgReportFlag}"
                                            ref='uploadImg'
                                            :headers="headers"
                                            :action="$axios.defaults.baseURL+'/ms/api/quality/check/uploadImg'"
                                            list-type="picture-card"
                                            accept="image/png, image/jpg, image/jpeg"
                                            :before-upload="beforeIMgUpload"
                                            :on-success="reportlogImgSuccess"
                                            name="file"
                                            :limit=10
                                            :on-exceed="exceedImg"
                                            :on-remove="handleReportRemove">
                                            <i  class="el-icon-plus"></i>
                                        </el-upload>
                                    </div>
                                </div>
                            </div>
                            <div class="list">
                                <h2>整改要求</h2>
                                <div class="item">
                                    <div class="left">
                                        <span class="tip" style="color:red;">*</span>
                                        <span >　整改人 ：</span>
                                        <Select
                                            v-model="submitData.operator"
                                            style="width:300px;"
                                            placeholder="请选择"
                                            @on-change="getOperator"
                                            filterable
                                        >
                                            <Option
                                                v-for="(item , index) in operatorList"
                                                :value="item.id"
                                                :key="index"
                                            >{{item.nickname}}</Option>
                                        </Select>
                                    </div>
                                    <div class="right">
                                        <span class="tip" style="color:red;">*</span>
                                        <span style="margin-right:10px;">整改期限 ：</span>
                                        <DatePicker type="date"  :clearable="false" v-if="inputShow" format="yyyy-MM-dd"
                                        @on-change="getReportDate"
                                        v-model="submitData.timeLimit" placeholder="请输入" style="width: 280px;"></DatePicker>
                                        <DatePicker type="date"  v-if="inputShow" format="yyyy-MM-dd"  style="opacity:0;position: absolute;top:-9999px;width:1px;"></DatePicker>
                                        </div>
                                </div>
                                <div class="item">
                                    <div class="left item_com">
                                        <span class="tip" style="color:red;">*</span>
                                        <span >整改要求 ：</span>
                                        <div class="textBox">
                                            <el-input  maxlength="200" show-word-limit placeholder="请输入"  type="textarea"   v-model="submitData.require"></el-input>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="list rec_com">
                                <h2>复查信息</h2>
                                <div class="item">
                                    <div class="left">
                                        <span class="tip" style="color:red;">*</span>
                                        <span style="margin-right:10px;">复查人 ：</span>
                                        <Select
                                            v-model="submitData.reviewPeople"
                                            style="width:705px;"
                                            placeholder="请选择"
                                            @on-change="getReviewPeople"
                                            filterable
                                        >
                                            <Option
                                                v-for="(item , index) in reviewPeopleList"
                                                :value="item.id"
                                                :key="index"
                                            >{{item.nickname}}</Option>
                                        </Select>
                                    </div>
                                </div>
                            </div>
                            <div class="list rec_com">
                                <h2>核验信息</h2>
                                <div class="item">
                                    <div class="left">
                                        <span class="tip" style="color:red;">*</span>
                                        <span style="margin-right:10px;">核验人 ：</span>
                                        <Select
                                            v-model="submitData.checkPeople"
                                            style="width:705px;"
                                            placeholder="请选择"
                                            @on-change="getCheckPeople"
                                            filterable
                                        >
                                            <Option
                                                v-for="(item , index) in checkPeopleList"
                                                :value="item.id"
                                                :key="index"
                                            >{{item.nickname}}</Option>
                                        </Select>
                                    </div>
                                </div>
                            </div>
                            <div class="list rec_com">
                                <h2>抄送信息</h2>
                                <div class="item">
                                    <div class="left">
                                        <span style="margin-right:10px;">抄送人 ：</span>
                                        <Select
                                            v-show="inputShow"
                                            v-model="submitData.sendPeople"
                                            style="width:705px;"
                                            placeholder="请选择"
                                            @on-change="getSendPeople"
                                            filterable
                                            multiple
                                        >
                                            <Option
                                                v-for="(item , index) in sendPeopleList"
                                                :value="item.id"
                                                :key="index"
                                            >{{item.nickname}}</Option>
                                        </Select>
                                        <Select
                                            v-model="submitData.sendPeople"
                                            placeholder="请选择"
                                            @on-change="getSendPeople"
                                            filterable
                                            multiple
                                            v-show="inputShow"
                                            style="opacity:0;position: absolute;top:-9999px;width:1px;"
                                        >
                                            <Option
                                                v-for="(item , index) in sendPeopleList"
                                                :value="item.id"
                                                :key="index"
                                            >{{item.nickname}}</Option>
                                        </Select>
                                        <div style="width:5px;"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </TabPane>
            </Tabs>
            <div slot="footer">
                <div class="footer">
                    <div class="button cancel" @click="cancel(1)">取消</div>
                    <div class="button submit" @click="submit" v-preventReClick="1500">提交</div>
                </div >
            </div>
        </Modal>

        <Modal v-model="gpsModal" title="选择项目位置" width="1000px" :mask-closable="false" class-name="msgModal">
            <div class="msg">
                <div style="width:900px;height:500px;margin:20px auto;position: relative;">
                    <div id="gps" class="gps"></div>
                    <div class="searchAddress">
                         <Input search enter-button placeholder="请输入准确的检查地址"  style="width:300px"  @on-search="searchAddress" v-model="completeAddress" clearable/>
                    </div>
                </div>
            </div>
            <div slot="footer">
                <div class="footer">
                    <div class="button cancel" @click="cancel(2)">取消</div>
                    <div class="button submit" @click="submitGPS" v-preventReClick="1500">确定</div>
                </div >
            </div>
        </Modal>

        <Modal v-model="detailsInfoModal" :title="detailsInfoObj.checkResult == '隐患问题' ? '隐患问题' : '巡检排查'" width="900px;" :mask-closable="false" :footer-hide='true' class-name="msgModal">
            <div class="detailsModal">
                <div class="list">
                    <div class="item" style="margin-bottom:15px;">
                        <div class="left">
                            <span style="width: 90px;">检查人 ：</span>
                            <span>{{detailsInfoObj.checkName ? detailsInfoObj.checkName : '—'}}</span>
                        </div>
                        <div class="right">
                            <span style="width: 90px;">检查部位 ：</span>
                            <span>{{detailsInfoObj.partName ? detailsInfoObj.partName : '—'}}</span>
                        </div>
                    </div>
                    <div class="item"  style="margin-bottom:15px;">
                        <div class="left">
                            <span style="width: 90px;">检查时间 ：</span>
                            <span>{{detailsInfoObj.checkTime ? detailsInfoObj.checkTime : '—'}}</span>
                        </div>
                        <div class="right">
                            <span style="width: 90px;">检查地点 ：</span>
                            <div class="rightText"  style="max-width:400px">
                                <Tooltip  transfer :content="detailsInfoObj.location ? detailsInfoObj.location : '—'" placement="top-start"  max-width='250'>
                                    <p style="width:250px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;cursor: pointer;">
                                            {{detailsInfoObj.location ? detailsInfoObj.location : '—'}}
                                    </p>
                                </Tooltip>
                            </div>
                        </div>
                    </div>
                    <div class="item"  style="margin-bottom:15px;">
                        <div class="right " >
                            <span style="white-space:nowrap; width: 90px;">检查说明 ：</span>
                            <div class="rightText"  style="max-width:400px">
                                <Tooltip  transfer :content="detailsInfoObj.checkResult ? detailsInfoObj.checkResult : '—'" placement="top-start"  max-width='250'>
                                    <p style="width:250px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;cursor: pointer;">
                                            {{detailsInfoObj.checkResult ? detailsInfoObj.checkResult : '—'}}
                                    </p>
                                </Tooltip>
                            </div>
                        </div>
                    </div>
                    <div class="item"  style="margin-bottom:15px;">
                        <div class="right " >
                            <span style="white-space:nowrap; width: 90px;">现场图片 ：</span>
                            <div style="flex:1;" class="img" v-if='detailsInfoObj.imgUrls&&detailsInfoObj.imgUrls.length > 0'>
                                <el-image style=" width: 77px;height: 77px;margin-right: 50px; margin-bottom: 10px;" :src="item" alt="" v-for="(item,i) in detailsInfoObj.imgUrls" :key="i"  :preview-src-list="detailsInfoObj.imgUrls"></el-image>
                            </div>
                            <div class="img" v-else>—</div>
                        </div>
                    </div>
                </div>
            </div>
        </Modal>
    </div>
</template>
<script>
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import { transId } from "@/sever/config.js";
import {
    getUserList,
    getQualityPartList,
    problemReportAdd,
    issueDeptIdList,
    getQualityTaskExecList,
    getQualityTaskMeExecNum,
    getQualityTaskComplete,
    getQualityTaskExecComplete
} from "@/api/quality.js";
export default {
    components: { Treeselect },
    data() {
        return {
            headers: {
                Authorization:localStorage.getItem('COOKIE'),
            },
            dateArr:[],
            btnList:[],
            tabActiveName:"-1",
            detailActiveName:"1",
            options: {
                disabledDate(date) {
                    return date > Date.now();
                }
            },
            options1: {
                disabledDate (date) {
                    return date && date.valueOf() < Date.now() - 86400000;
                }
            },
            current: 1,
            pageSize: 10,
            pageNum: 1,
            count: 0,
            list: [],
            state: 0,
            inputShow: false,
            modal: false,
            gpsModal: false,
            overdueList:[
                {
                    id:0,
                    name:'正常检查'
                },
                {
                    id:1,
                    name:'超时检查'
                }
            ],
            taskId:'',
            keyword:'',
            overdue:'',
            deptId:'',
            checkNum:0,
            notStartedNum:0,
            underwayNum:0,
            doneNum:0,
            notRelease:0,
            imgCheckFlag:false,
            imgReportFlag:false,
            // 检查上报
            partName:'',
            location:"",
            checkResult:"",
            datalist:[],
            prjmap:'',
            marker:null,
            // 问题上报数据对象
            submitData:{
                partId:"",
                partName:"",
                issueTypeId:"",
                issueTypeName:"",
                issueId:"",
                checkText:"",
                generalRadio:'一般',
                issueTree:null,
                issueContent:"",
                siteImgUrl:[],
                timeLimit:"",
                require:"",
                operator:"",
                reviewPeople:"",
                checkPeople:"",
                sendPeople:"",
                sendPeopleObj:[],
                checkPeopleObj:"",
                reviewPeopleObj:"",
                operatorObj:"",
                lat: "",
                lng: "",
                ads: "请选择检查地址"
            },
            switchClassName:"",
            switchCheckName:"",
            operatorList:[],
            reviewPeopleList:[],
            sendPeopleList:[],
            checkPeopleList:[],
            issuelist:[],
            // 完成任务
            completeAds:"请选择检查地址",
            completeAdsLng:"",
            completeAdsLat:"",
            completeLng:"",
            completeLat:"",
            completeAddress:"",
            completeExecId:"",
            completeCheckResult:"",
            completePartName:"",
            completeImgUrls:[],
            // 我的任务检查详情
            detailsInfoModal:false,
            detailsInfoObj:{},
            auth:{
                isComplete:false
            }, 
        };
    },
    computed: {
        porjectObject() {
            return this.$store.state.porjectObject;
        }
    },
    watch: {
        porjectObject(val, oldVal) {
            if (val.deptId != oldVal.deptId) {
                this.deptId = val.deptId;
                this.pageNum = 1;
                this.current = 1;
                this.dateArr = [];
                this.getAllList();
                this.getQualityTaskExecNumFn();
            }
        },
        tabActiveName(val ,oldVal){
            if(val != oldVal){
                this.pageNum = 1;
                this.current = 1;
                this.getAllList();
            }
        },
        'submitData.siteImgUrl': {
            handler(val, oldVal) {
                //do something
                if(val.length==10){
                    this.imgReportFlag=true
                }else{
                    this.imgReportFlag=false

                }
            },
            deep: true
        },
        completeImgUrls: {
            handler(val, oldVal) {
                //do something
                if(val.length==10){
                    this.imgCheckFlag=true
                }else{
                    this.imgCheckFlag=false

                }
            },
            deep: true
        }

    },
    mounted() {
        this.deptId = this.$store.state.porjectObject.deptId;
        this.getAllList();
        this.getQualityTaskExecNumFn();
        this.btnList = JSON.parse(localStorage.getItem("arr"));
        this.initAuth() //初始化权限
        setTimeout(()=>{
            this.inputShow = true;
        },1)
    },
    methods: {
        initAuth(){
            this.auth.isComplete = this.btnList.includes('quality/task/complete')
        },
        addRowFn(type , index, rows){
            if(type == 5){
                this.detailsInfoModal = true;
                this.detailsInfoObj = rows[index];
            }
        },
        // 弹出弹框并保存检查任务id
        isCompleteFn(item){
            this.completeExecId = item.execId;
            this.completePartName = item.partName;
            this.modal = true;
            this.detailActiveName = '1';
            // 重置检查上报
            this.completeAds="请选择检查地址";
            this.completeAdsLng="";
            this.completeAdsLat="";
            this.completeCheckResult="";
            this.completeImgUrls=[];
            // 重置问题上报
            this.adsLat = "";
            this.adsLng  = "";
            this.submitData.partId=item.partId;
            this.submitData.partName=item.partName;
            this.submitData.ads="请选择检查地址";
            this.submitData.generalRadio='一般';
            this.switchClassName='选择录入',
            this.switchCheckName='选择录入',
            this.submitData.siteImgUrl = []
            this.siteImgUrl=[];
            this.getChecktPartList();
            this.issueDeptIdListAll();
            this.getUser();
        },
        // 关闭弹窗的时候，并清楚图片上传
        visibleChangeFn(e){
            if(!e){
                this.$refs.uploadImg.clearFiles();
                this.$refs.completeUploadImg.clearFiles();
            }
        },
        // 完成任务 or 问题上报
        submit() {
            if(this.detailActiveName == 1){
                this.checkreportFn();
            }else{
                this.IssueReportFn();
            }
        },
        //获取列表
        getAllList() {
            let parmas = {
                deptId: this.deptId,
                keyword: this.keyword,
                overdue: this.overdue,
                state: this.tabActiveName == -1 ? '' : this.tabActiveName,
                pageNum: this.pageNum,
                pageSize: this.pageSize,
                startTime: this.dateArr[0],
                endTime: this.dateArr[1],
                report: 1,
            };
            getQualityTaskExecList(parmas)
            .then(res => {
                if (res.code == 200) {
                    this.list = res.data.list;
                    this.count = res.data.total;
                } else {
                    this.$Message.warning(res.msg);
                }
            })
            .catch(error => {
                console.log(error);
            });
        },
        // 获取数据统计
        getQualityTaskExecNumFn() {
            let parmas = {
                deptId: this.deptId,
                keyword: this.keyword,
                overdue: this.overdue,
                state: this.tabActiveName == -1 ? '' : this.tabActiveName,
                startTime: this.dateArr[0],
                endTime: this.dateArr[1],
                report: 1,
            };
            getQualityTaskMeExecNum(parmas)
            .then(res => {
                if (res.code == 200) {
                    this.checkNum = res.data.checkNum || 0;
                    this.notStartedNum = res.data.notStartedNum || 0;
                    this.underwayNum = res.data.underwayNum || 0;
                    this.doneNum = res.data.doneNum || 0;
                } else {
                    this.$Message.warning(res.msg);
                }
            })
            .catch(error => {
                console.log(error);
            });
        },
        // 排查上报
        checkreportFn(){
            if(this.completeAds==""||!this.completeAds){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择检查地址"
                });
                return;
            }
            if(this.completeLng==""||this.completeLat==""||!this.completeLng||!this.completeLat){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "未获取到经纬度"
                });
                return;
            }
            if(this.completeCheckResult==""||!this.completeCheckResult){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请填写检查说明"
                });
                return;
            }
            let parmas = {
                lng: this.completeLng,
                lat: this.completeLat,
                location: this.completeAds,
                execId: this.completeExecId,
                checkResult: this.completeCheckResult,
                imgUrls: this.completeImgUrls,
            };
            getQualityTaskExecComplete(parmas)
            .then(res => {
                if (res.code == 200) {
                    this.$Message.success("操作成功");
                    this.pageNum = 1;
                    this.current = 1;
                    this.getAllList();
                    this.getQualityTaskExecNumFn();
                    this.modal = false;
                } else {
                    this.$Message.warning(res.msg);
                }
            })
            .catch(error => {
                console.log(error);
            });
        },
        searchAll() {
            this.pageNum = 1;
            this.current = 1;
            this.getAllList();
            this.getQualityTaskExecNumFn();
        },
        clear() {
            this.keyword = "";
            this.overdue = "";
            this.pageNum = 1;
            this.dateArr = [];
            this.getAllList();
            this.getQualityTaskExecNumFn();
        },
        getDateArr(i,v){
            this.dateArr = i;
        },
        pageChange(index) {
            this.pageNum = index;
            this.getAllList();
        },
        getGPS() {
            if(this.detailActiveName == 1){
                var _that = this;
                _that.gpsModal = true;
                _that.completeAddress = "";
                _that.completeLat = _that.completeLat || 30.592335;
                _that.completeLng = _that.completeLng || 114.29484;
                _that.prjmap = new AMap.Map("gps", {
                    zoom: 14,
                    center: [_that.completeLng,_that.completeLat],
                });
                var marker;
                AMap.event.addListener(_that.prjmap, "click", function(e) {
                    if(_that.marker != null) {
                        _that.prjmap.remove(_that.marker);
                    }
                    _that.marker = new AMap.Marker({
                        icon:"https://webapi.amap.com/theme/v1.3/markers/n/mark_bs.png",
                        position: [e.lnglat.lng, e.lnglat.lat],
                        offset: new AMap.Pixel(-20, -40)
                    });
                    _that.completeAddress = "";
                    _that.marker.setMap(_that.prjmap);
                    _that.completeLng = e.lnglat.lng;
                    _that.completeLat = e.lnglat.lat;
                    _that.completeAdsLng = e.lnglat.lng;
                    _that.completeAdsLat = e.lnglat.lat;
                    AMap.service("AMap.Geocoder", function() {
                        //回调函数
                        //实例化Geocoder
                        var geocoder = new AMap.Geocoder({
                            city: "" //城市，默认:“全国”
                        });
                        var lnglatXY = [e.lnglat.getLng(), e.lnglat.getLat()]; //地图上所标点的坐标
                        geocoder.getAddress(lnglatXY, function(status, result) {
                            if (status === "complete" && result.info === "OK") {
                                //获得了有效的地址信息:
                                //即，result.regeocode.formattedAddress
                                var city = result.regeocode.formattedAddress;
                            } else {
                                var city = "暂无位置信息";
                                //获取地址失败
                            }
                            _that.completeAds = city;
                        });
                    });
                });
                if (_that.completeAdsLng != "") {
                    _that.marker = new AMap.Marker({
                        icon:"https://webapi.amap.com/theme/v1.3/markers/n/mark_bs.png",
                        position: [_that.completeAdsLng, _that.completeAdsLat],
                        offset: new AMap.Pixel(-20, -40)
                    });
                    _that.marker.setMap(_that.prjmap);
                } else {
                    _that.marker = new AMap.Marker({});
                }
            }else{
                var _that = this;
                _that.gpsModal = true;
                _that.completeAddress = "";
                _that.submitData.lat = _that.submitData.lat || 30.592335;
                _that.submitData.lng = _that.submitData.lng || 114.29484;
                _that.prjmap = new AMap.Map("gps", {
                    zoom: 14,
                    center: [_that.submitData.lng,_that.submitData.lat],
                });
                var marker;
                AMap.event.addListener(_that.prjmap, "click", function(e) {
                    if(_that.marker != null) {
                        _that.prjmap.remove(_that.marker);
                    }
                    _that.marker = new AMap.Marker({
                        icon:"https://webapi.amap.com/theme/v1.3/markers/n/mark_bs.png",
                        position: [e.lnglat.lng, e.lnglat.lat],
                        offset: new AMap.Pixel(-20, -40)
                    });
                    _that.completeAddress = "";
                    _that.marker.setMap(_that.prjmap);
                    _that.submitData.lng = e.lnglat.lng;
                    _that.submitData.lat = e.lnglat.lat;
                    _that.adsLng = e.lnglat.lng;
                    _that.adsLat = e.lnglat.lat;
                    AMap.service("AMap.Geocoder", function() {
                        //回调函数
                        //实例化Geocoder
                        var geocoder = new AMap.Geocoder({
                            city: "" //城市，默认:“全国”
                        });
                        var lnglatXY = [e.lnglat.getLng(), e.lnglat.getLat()]; //地图上所标点的坐标
                        geocoder.getAddress(lnglatXY, function(status, result) {
                            if (status === "complete" && result.info === "OK") {
                                //获得了有效的地址信息:
                                //即，result.regeocode.formattedAddress
                                var city = result.regeocode.formattedAddress;
                            } else {
                                var city = "暂无位置信息";
                                //获取地址失败
                            }
                            _that.submitData.ads = city;
                        });
                    });
                });
                if (_that.adsLng != "") {
                    _that.marker = new AMap.Marker({
                        icon:"https://webapi.amap.com/theme/v1.3/markers/n/mark_bs.png",
                        position: [_that.adsLng, _that.adsLat],
                        offset: new AMap.Pixel(-20, -40)
                    });
                    _that.marker.setMap(_that.prjmap);
                } else {
                    _that.marker = new AMap.Marker({});
                }
            }
        },
        searchAddress(){
            if(this.completeAddress == "") {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请输入地址"
                });
                return;
            }
            var _that =this;
            if(_that.marker != null) {
                _that.prjmap.remove(_that.marker);
            }
            _that.marker = new AMap.Marker();
            AMap.service("AMap.Geocoder", function() {
                var geocoder = new AMap.Geocoder({
                    city: "", //城市设为北京，默认：“全国”
                });
                geocoder.getLocation(_that.completeAddress, function(status, result) {
                    if (status === 'complete'&&result.geocodes.length) {
                        var lnglat = result.geocodes[0].location;
                        if(_that.detailActiveName == 1){
                            _that.completeLng = lnglat.lng;
                            _that.completeLat = lnglat.lat;
                            _that.completeAdsLng = lnglat.lng;
                            _that.completeAdsLat = lnglat.lat;
                            _that.completeAds = _that.completeAddress;
                            _that.marker.setPosition(lnglat);
                            _that.prjmap.add(_that.marker);
                            _that.prjmap.setFitView(_that.marker);
                            _that.completeAddress = "";
                        }else{
                            _that.submitData.lng = lnglat.lng;
                            _that.submitData.lat = lnglat.lat;
                            _that.adsLng = lnglat.lng;
                            _that.adsLat = lnglat.lat;
                            _that.submitData.ads = _that.completeAddress;
                            _that.marker.setPosition(lnglat);
                            _that.prjmap.add(_that.marker);
                            _that.prjmap.setFitView(_that.marker);
                            _that.completeAddress = "";
                        }
                    }else{
                        _that.$Message.warning('根据地址查询位置失败');
                        // log.error('根据地址查询位置失败');
                    }
                });
            });
        },
        submitGPS() {
            this.gpsModal = false;
        },
        // 图片上传前钩子
        beforeIMgUpload(file){
            const isLt2M = file.size / 1024 / 1024 < 2;
            if (!isLt2M) {
                this.$Message.error("上传图片大小不能超过 2MB!");
            }
            return isLt2M;
        },
        // 图片上传成功
        reportlogImgSuccess(res){
            if(this.detailActiveName == 1){
                this.completeImgUrls.push(res.data);
            }else{
                this.submitData.siteImgUrl.push(res.data) ;
            }
        },
        exceedImg(files,fileList){
            if(this.completeImgUrls.length==10){
                this.$Message.warning('上传图片最多10张');
                return;
            }
            if(this.siteImgUrl.length==10){
                this.$Message.warning('上传图片最多10张');
                return;
            }
            if(this.submitData.siteImgUrl.length==10){
                this.$Message.warning('上传图片最多10张');
                return;
            }
        },
        handleReportRemove(res, fileList){
            if(this.detailActiveName == 1){
                this.completeImgUrls=[];
                fileList.forEach(v=>{
                    this.completeImgUrls.push(v.response.data)
                })
            }else{
                this.submitData.siteImgUrl=[];
                fileList.forEach(v=>{
                    this.submitData.siteImgUrl.push(v.response.data)
                })
            }

        },
        // 问题上报
        getUser(){
            let params = {
                deptId:this.deptId
            }
            getUserList(params).then((res) => {
                if(res.code==200){
                    this.operatorList = res.data;
                    this.reviewPeopleList = res.data;
                    this.sendPeopleList = res.data;
                    this.checkPeopleList = res.data;
                }else{
                    this.$Message.warning(res.msg);
                }
            }).catch((err) => {

            });
        },
        //获取检查部位
        getChecktPartList() {
            let params = {
                deptId: this.deptId
            };
            getQualityPartList(params)
                .then(res => {
                    if (res.code == 200) {
                        let data = res.data.list;
                        this.datalist = transId(data);
                        if(this.datalist.length==0){
                            this.datalist.push({
                                id :'all',
                                title :'暂无数据',
                                label :'暂无数据',
                                isDisabled: true,
                            })
                        }
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        //获取问题明細
        issueDeptIdListAll() {
            let parmas = {
                deptId:this.deptId
            }
            issueDeptIdList(parmas)
                .then(res => {
                    if (res.code == 200) {
                        let list  = res.data.list;
                        list.forEach(v=>{
                            v.name = v.content;
                            if(v.enableFlag==1){
                                this.issuelist.push(v)
                            }
                        })
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        switchCheckNameFn(){
            this.submitData.partId= ''
            this.submitData.partName= ''
            this.submitData.checkTree= null
        },
        switchClassNameFn(){
            this.submitData.issueTypeId=''
            this.submitData.issueTypeName=''
            this.submitData.isssueId=''
            this.submitData.issueTree=null
            this.submitData.issueContent=''
        },
        getReportCheckSelect(index) {
            let partName = index.name;
            if(index.pid!=0){
                let resArr  = this.treeFindPath(this.datalist, data=> data.partId===index.pid)
                partName= resArr.join('/')+partName
            }
            this.submitData.partId = index.id;
            this.submitData.partName = partName;
        },
        getReportDate(index){
            this.submitData.timeLimit=  index
        },
        getOperator(index){
            this.submitData.operator=index;
            this.operatorList.forEach(v=>{
                if(index==v.id){
                    let obj = {
                        type:2,
                        userName:v.nickname,
                        userPhone:v.phone,
                        userId:v.id,
                    }
                    this.submitData.operatorObj=obj;
                }
            })
        },
        getReviewPeople(index){
            this.submitData.reviewPeople=index;
            this.reviewPeopleList.forEach(v=>{
                if(index==v.id){
                    let obj = {
                        type:3,
                        userName:v.nickname,
                        userPhone:v.phone,
                        userId:v.id,
                    }
                    this.submitData.reviewPeopleObj=obj;
                }
            })
        },
        getCheckPeople(index){
            this.submitData.checkPeople=index;
            this.checkPeopleList.forEach(v=>{
                if(index==v.id){
                    let obj = {
                        type:4,
                        userName:v.nickname,
                        userPhone:v.phone,
                        userId:v.id,
                    }
                    this.submitData.checkPeopleObj=obj;
                }
            })
        },
        getSendPeople(index){
            this.submitData.sendPeople=index;
            let arr = []
            index.forEach(i=>{
                this.sendPeopleList.forEach(v=>{
                    if(i==v.id){
                        let obj = {
                            type:5,
                            userName:v.nickname,
                            userPhone:v.phone,
                            userId:v.id,
                        }
                        arr.push(obj);
                    }
                })
            })
            this.submitData.sendPeopleObj = arr;

        },
        getIssueClassSelect(index) {
            this.issuelist.forEach((v,i)=>{
                if(index==v.issueId){
                    this.submitData.isssueId = v.issueId;
                    this.submitData.issueTypeId = v.issueTypeId;
                    this.submitData.issueTypeName =v.issueTypeName;
                    this.submitData.issueContent = v.name;
                    this.submitData.require = v.require;
                    let newDate = new Date().getTime();
                    let date = v.duration*86400000;
                    let resDate = newDate+date;
                    this.submitData.timeLimit = new Date(parseInt(resDate) ).toLocaleString().replace(/年|月/g, "-").replace(/日/g, " ");
                }
            })
        },
        // 问题上报
        IssueReportFn(){
            if(this.submitData.ads==""||!this.submitData.ads){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择检查地址"
                });
                return;
            }

            if(this.submitData.lng==""||this.submitData.lat==""||!this.submitData.lng||!this.submitData.lat){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "未获取到经纬度"
                });
                return;
            }
            if(this.submitData.issueContent==""||!this.submitData.issueContent){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请填写问题明细"
                });
                return;
            }
            if(this.submitData.partName==""||!this.submitData.partName){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请填写检查部位"
                });
                return;
            }
            if(this.submitData.checkText==""||!this.submitData.checkText){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请填写检查说明"
                });
                return;
            }
            if(this.submitData.generalRadio==""||!this.submitData.generalRadio){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择紧急程度"
                });
                return;
            }

            if(this.submitData.operatorObj==""||!this.submitData.operatorObj){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择整改人"
                });
                return;
            }
            if(this.submitData.timeLimit==""||!this.submitData.timeLimit){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择整改期限"
                });
                return;
            }
            if(this.submitData.require==""||!this.submitData.require){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请填写整改要求"
                });
                return;
            }

            if(this.submitData.operatorObj==""||!this.submitData.operatorObj){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择整改人"
                });
                return;
            }
            if(this.submitData.reviewPeopleObj==""||!this.submitData.reviewPeopleObj){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择复查人"
                });
                return;
            }
            if(this.submitData.checkPeopleObj==""||!this.submitData.checkPeopleObj){
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择核验人"
                });
                return;
            }
            if(this.submitData.generalRadio=='紧急'){
                this.submitData.generalRadio = 2;
            }else{
                this.submitData.generalRadio =1;
            }
            let timeLimit = new Date( this.submitData.timeLimit);
            this.submitData.timeLimit =timeLimit.getFullYear() + "-" + (timeLimit.getMonth() + 1) + "-" + timeLimit.getDate();
            let parmas = {
                deptId: this.deptId,
                taskExecId: this.completeExecId,
                partId: this.submitData.partId,
                partName:this.submitData.partName,
                issueTypeId: this.submitData.issueTypeId,
                issueTypeName: this.submitData.issueTypeName,
                issueId: this.submitData.isssueId,
                issueContent: this.submitData.issueContent,
                rectifyRequire: this.submitData.require,
                rectifyDuration: this.submitData.timeLimit,
                urgency:  this.submitData.generalRadio,
                checkDesc: this.submitData.checkText,
                address: this.submitData.ads,
                lng: this.submitData.lng,
                lat: this.submitData.lat,
                imgUrls: this.submitData.siteImgUrl,
                checkUsers: [this.submitData.operatorObj,this.submitData.reviewPeopleObj,this.submitData.checkPeopleObj,...this.submitData.sendPeopleObj],
            }
            problemReportAdd(parmas).then((res) => {
                if(res.code==200){
                    this.$Message.success(res.msg);
                    this.modal= false;
                    this.submitData = {};
                    this.submitData.siteImgUrl=[]
                    this.submitData.sendPeopleObj=[]
                    this.getAllList();
                    this.getQualityTaskExecNumFn();
                }else{
                    this.$Message.warning(res.msg);
                }
            }).catch((err) => {

            });
        },
        // 公共关闭弹框
        cancel(type) {
            if (type == 1) {
                this.modal = false;
            } else if (type == 2) {
                this.gpsModal = false;
            } else if (type == 3) {
                this.detailsInfoModal = false;
            }
        },
    }
};
</script>

<style scoped lang="less">
@import "./../../assets/style/themeBase.less";
@import "./../../assets/style/qualityAndSafety/record.less";
</style>

<style scoped lang="scss">
@import "./../../assets/style/qualityAndSafety/checktask.scss";
@import "./../../assets/style/qualityAndSafety/modal.scss";
.searchAddress{
    width: 300px;
    position: absolute;
    top: 5px;
    left: 300px;
    display: flex;
    justify-content: space-between;
}
/deep/ .modal{
    h2{
        width: 100%;
        height: 32px;
        line-height: 32px;
        background: var(--themeColor2);
        font-size: 14px;
        font-family: Source Han Sans CN;
        font-weight: 500;
        padding-left: 45px;
        box-sizing: border-box;
        color: var(--themeColor);
        margin-bottom: 15px;
    }
    .list{
        width: 100%;
        margin: auto;
        &.rec_com{
            .left{
                width: 100%;
                .ivu-select{
                    flex: 1;
                }
            }

        }
        .item{
            width: 90%;
            margin: 15px auto;
            position: relative;
            display: flex;
            justify-content: space-between;
            .tip{
                position: absolute;
                left: -5px;
                top: -3px;
            }
            .left{
                position: relative;
                &.item_com{
                    width: 100%;
                    display: flex;
                    justify-content: space-between;
                    align-items: flex-start;
                    .textBox{
                        flex: 1;
                    }

                }

            }
            .right{
                position: relative;
                .ivu-select{
                    .ivu-select-dropdown{
                        width: 300px !important;
                        .ivu-select-item{
                            width: 100% !important;
                            overflow: hidden !important;
                            text-overflow:ellipsis !important;
                            white-space: nowrap !important;
                        }
                    }
                }
            }
            &.switch{
                    display: block;
                    .top{
                        position: relative;
                        display: flex;
                        justify-content: space-between;
                        .readio{
                            position: relative;
                            width: 50%;
                        }
                    }
                    .bottom{
                        display: flex;
                        justify-content: space-between;
                        .ivu-select-dropdown{
                            width: 300px !important;
                            .ivu-select-item{
                                width: 100% !important;
                                overflow: hidden !important;
                                text-overflow:ellipsis !important;
                                white-space: nowrap !important;
                            }
                        }
                    }
                .left,
                .right{
                    position: relative;
                    display: flex;
                    justify-content: flex-start;
                    align-items: center;
                }
                .right{
                    margin-left: 40px;

                }
                .Select{
                    height: 100%;
                }
                .ivu-input{
                    padding: 0 5px;
                    height: 100%;
                }
                .ivu-select-selection{
                    height: 100%;
                }
            }
            .left,
            .right{
                position: relative;
                display: flex;
                justify-content: space-between;
                align-items: center;
                flex-wrap: wrap;
            }

            &.img{

                display: flex;
                justify-content: flex-start;
                align-items: flex-start;
            }
            .avatar-uploader{
                flex: 1;
                display: flex;
                justify-content: flex-start;
                align-items: flex-start;
                flex-wrap: wrap;
            }
            .el-upload--picture-card{
                width: 80px;
                height: 80px;
                border: 1px dashed #d9d9d9;
                border-radius: 6px;
                cursor: pointer;
                position: relative;
            }
            .avatar-uploader .el-upload:hover {
                border-color: var(--themeColor);
            }
            .avatar-uploader-icon {
                font-size: 28px;
                color: #8c939d;
                width: 80px;
                height: 80px;
                line-height: 80px;
                text-align: center;
            }
            .el-upload--picture-card{
                line-height: 80px !important;
            }
             .avatar {
                width: 80px;
                height: 80px;
                display: block;
            }
            .el-upload-list--picture-card .el-upload-list__item {
                width: 80px !important;
                height: 80px !important;
                margin-right: 77px;
                margin-bottom: 10px;
                &:nth-of-type(5n){
                    margin-right: 0px;
                }
            }
        }
    }
}
/deep/ .checkTaskDetails{
    .list{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin-bottom:15px;
        .item{
            display: flex;
            justify-content: flex-start;
            align-items: center;
            .name{
                width: 90px;
                font-size: 14px;
                font-family: Microsoft YaHei;
                color: #666666;
            }
            .num{
                width: 100px;
                color: #00ACFB;
                font-size: 16px;
                font-family: Arial;
                font-weight: bold;
            }
        }
    }
    .tabBox {
        width: 100%;
        margin: 0 auto;
        background-color: #fff;
        border-radius: 10px;
        padding: pxToRem(20) 0;
        padding-top: 0;
        box-sizing: border-box;
        .tableList {
            width: 96%;
            margin: auto;
            .el-table {
                color: #5E5F60;
                font-family: MicrosoftYaHei;
                font-size: pxToRem(14);
                font-weight: 500;
                td,
                th.is-leaf {
                    border-bottom: none;
                }
                tr {
                    border: none;
                }
                thead th {
                    background-color: #EAF4FE !important;
                    color: #5E5F60;
                    font-weight: 400;
                }
            }
            .el-table__empty-text {
                width: 100%;
                .no_lsit {
                    margin: auto;
                    img {
                        width: 600px;
                        height: 450px !important;
                    }
                }
            }
            .el-table__row {
                background-color: #fff;
                cursor: pointer;
            }
            .el-table--striped .el-table__body tr.el-table__row--striped td {
                background-color: #DCDCDC;
                cursor: pointer;
            }
        }
    }
}
/deep/ .uploadList{
    width: 560px;
    .el-upload-list__item{
        width: 80px;
        height: 80px;
        margin: 0 32px 9px 0 !important;
    }
    .el-upload--picture-card{
        width: 80px;
        height: 80px;
        line-height: 80px;
    }
}
#gps {
    height: 100%;
}
</style>
